<script setup lang="ts">
defineProps<{
  isLoading: boolean
}>()
</script>

<template>
  <transition name="fade">
    <div class="loading-container" v-if="isLoading">
      <div class="loading-spinner"></div>
    </div>
  </transition>
</template>

<style scoped>
/* src/assets/loading-animation.css */
.loading-spinner {
  /* 其他样式保持不变 */
  opacity: 0;
  transform: scale(0);
  animation:
    spin 1s ease infinite,
    fadeIn 0.5s ease forwards;
}

@keyframes fadeIn {
  0% {
    opacity: 0;
    transform: scale(0);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}
</style>
